<template>
  <el-row>
    <el-col style="background-color: #FFFFFF">
      <div class="archive-api">
        <anchor v-model="anchor">
          <anchor-item label="开发包介绍" name="1" class="anchor-item">
            <template>
              <v-md-editor v-model="text1" mode="preview"></v-md-editor>
            </template>
          </anchor-item>
          <anchor-item label="目录框架结构" name="2" class="anchor-item">
            <template>
              <v-md-editor v-model="text2" mode="preview"></v-md-editor>
            </template>
          </anchor-item>
          <anchor-item label="创建三维场景" name="3" class="anchor-item">
            <template>
              <v-md-editor v-model="text3" mode="preview"></v-md-editor>
            </template>
          </anchor-item>
          <anchor-item label="添加图层" name="4" class="anchor-item">
            <template>
              <v-md-editor v-model="text4" mode="preview"></v-md-editor>
            </template>
          </anchor-item>
          <anchor-item label="添加地形" name="5" class="anchor-item">
            <template>
              <v-md-editor v-model="text5" mode="preview"></v-md-editor>
            </template>
          </anchor-item>
        </anchor>
      </div>
    </el-col>
  </el-row>
</template>

<script>

//
import VueMarkdownEditor from '@kangc/v-md-editor';
import '@kangc/v-md-editor/lib/style/base-editor.css';
import githubTheme from '@kangc/v-md-editor/lib/theme/github.js';
import '@kangc/v-md-editor/lib/theme/style/github.css';
import hljs from 'highlight.js';

VueMarkdownEditor.use(githubTheme, {
  Hljs: hljs,
});

Vue.use(VueMarkdownEditor);

import Anchor from '@/components/Anchor/Anchor'
import AnchorItem from '@/components/Anchor/AnchorItem'
import {quickPublic} from "@/api/development-center/introduce";
export default {
  name: "IntroduceList",
  components: {Anchor, AnchorItem},
  mixins:[quickPublic],
  data() {
    return {
      anchor: '1'
    }
  },
}
</script>


<style lang="scss" scoped>
.archive-api{
  position: inherit;
}

.anchor-item {
  margin-bottom: 15px;
  background-color: #fff;

  .text {
    padding: 20px;
  }
}
</style>